<?xml version="1.0" encoding="UTF-8" ?>
<%@page import="javax.servlet.jsp.jstl.fmt.LocalizationContext"%>
<%@page import="java.util.ResourceBundle"%>
<%@page import="java.util.Calendar"%>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.List"%>
<%@ page import="org.jakim.entity.*"%>
<%@ page import="org.jakim.utils.*"%>
<%@page import="org.apache.taglibs.standard.tlv.JstlCoreTLV"%>
<%@page import="org.apache.taglibs.standard.tlv.JstlFmtTLV"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<fmt:setLocale value="en" />
<fmt:setBundle basename="org.jakim.messages.messages" var="msg"
	scope="session" />
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Insert title here</title>
<link href="../styles/main.css" rel="stylesheet" type="text/css" />
<link href="../styles/wizard.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">

    function setOnwards(chkBox) {
    	   document.getElementById('cbToMonth').disabled = chkBox.checked;
    	   document.getElementById('cbToYear').disabled = chkBox.checked;
    	   chkBox.value = chkBox.checked;
    	}


</script>
</head>
<body>
	<%
	HttpSession httpSeesion = request.getSession();
	AdditionaInfo additionalInfo = null;
	
	Object objAdditionalInfo = httpSeesion.getAttribute("attrAdditionalInfo");
	
	if (objAdditionalInfo != null && objAdditionalInfo instanceof AdditionaInfo){
		additionalInfo = (AdditionaInfo) objAdditionalInfo;
	}
%>
	<div id="divBodyContainer">
		<h1>
			<fmt:message key="ADDITIONALINFO.HEADER" />
		</h1>

		<p>
			<fmt:message key="ADDITIONALINFO.SUMMARY" />
		</p>

		<button id="addButton">
			<fmt:message key="ADDITIONALINFO.ADD.BUTTON" />
		</button>

		<div id="wizardHistoryBody">
			<%
	   			if (additionalInfo != null){
	   				%>
			<table id="addedAdditionalInfo" class="userEntriesTable">
				<tr>
					<th><fmt:message key="ADDITIONALINFO.ADDS.TABLE.HEADER.LABEL" />
					</th>
				</tr>

				<tr>
					<td class="colParam"><fmt:message
							key="ADDITIONALINFO.ADDS.TABLE.INFORMATION.LABEL" />:</td>
					<td class="colValue"><%=additionalInfo.getAdditionalInfo() %>
					</td>
				</tr>

				<tr>
					<td class="colParam"><fmt:message
							key="ADDITIONALINFO.ADDS.TABLE.ANNEXES.LABEL" />:</td>
					<td class="colValue"><%=additionalInfo.getAnnexes() %></td>
				</tr>
			</table>
			<%
   				}
	   		%>
		</div>

		<div id="shade"></div>
		<div id="modalForm">
			<form id="formAdditionalInfo" class="formExperience"
				action="../addinfo" method="post">
				<fieldset id="fsetAdditionalInfo" class="fsetWizard">
					<legend>
						<fmt:message key="ADDITIONALINFO.FORM.LABEL" />
						:
					</legend>
					<div id="divAdditionalInfo">
						<label id="lblAdditionalInfo" for="txtAdditionalInfo"> <fmt:message
								key="ADDITIONALINFO.FORM.ADDITIONAL.INFORMATION.LABEL" />:
						</label>
						<textarea id="txtAdditionalInfo" name="additionalInfo" rows="5"
							cols="20"></textarea>
					</div>

					<div id="divAnnex">
						<label id="lblAnnex" for="txtAnnex"> <fmt:message
								key="ADDITIONALINFO.FORM.ANNEXES.LABEL" />:
						</label>
						<textarea id="txtAnnex" name="additionalAnnex" rows="5" cols="20"></textarea>
					</div>

					<input type="hidden" value="5" name="numberCVWizardStep" />

				</fieldset>
				<button type="submit">
					<fmt:message key="SUBMIT.BUTTON" />
				</button>
			</form>
		</div>
		<button id="done"
			onclick="window.location.href = 'personalskillswizard.jsp'">
			<fmt:message key="DONE.BUTTON" />
		</button>
		<script type="text/javascript">        
            var modal= document.getElementById('modalForm');
            var shade= document.getElementById('shade');
            document.getElementById('addButton').onclick= function() {
                modal.style.display=shade.style.display= 'block';
            };
            
            document.getElementById('close').onclick= function() {
                modal.style.display = shade.style.display = 'none';
            };

            // This code is a workaround for IE6's lack of support for the
            // position: fixed style.
            //
            if (!('maxHeight' in document.body.style)) {
                function modalsize() {
                    var top= document.documentElement.scrollTop;
                    var winsize= document.documentElement.offsetHeight;
                    var docsize= document.documentElement.scrollHeight;
                    shade.style.height= Math.max(winsize, docsize)+'px';
                    modal.style.top= top+Math.floor(winsize/3)+'px';
                };
                modal.style.position=shade.style.position= 'absolute';
                window.onscroll=window.onresize= modalsize;
                modalsize();
            }
        </script>
	</div>
</body>
</html>